<template>
  <div class="Main">
    <div class="Main-wrap">
      <!-- 下拉选择框 -->
      <div class="Position-select">
        <!-- <img src="https://resumeurl.oss-cn-shenzhen.aliyuncs.com/imgUrl/journalism9.jpg" alt=""> -->
        <img src="https://static.zhipin.com/zhipin-geek/v424/web/geek/images/city_101010100.png" alt="">
        <img src="https://static.zhipin.com/zhipin-geek/v424/web/geek/images/city_101020100.png" alt="">
        <img src="https://static.zhipin.com/zhipin-geek/v424/web/geek/images/city_101280600.png" alt="">
      </div>
      <!-- 广告图 -->
      <div class="Adwertisement">
        <div class="Adwertisement-left">
          <div class="Adwertisement-left-t">
            <img
              src="../../assets/image/0ffee1cb38048f1c9d4bf77b48bca1ed.jpg"
              alt=""
            />
            <img
              src="../../assets/image/7f9228176d2369a4be45092a28f92231.jpg"
              alt=""
            />
          </div>
          <div class="Adwertisement-left-t">
            <img
              src="../../assets/image/719b5568228bda8229408e1401457f13.jpg"
              alt=""
            />
            <img
              src="../../assets/image/631e45e84ab482efaaf0a2bafb4d9219.jpg"
              alt=""
            />
          </div>
          <div class="Adwertisement-left-b">
            <img
              src="../../assets/image/7f7508cb10873b2b6df12820193d1a93.jpg"
              alt=""
            />
          </div>
        </div>
        <div class="Adwertisement-right">
          <div class="Adwertisement-right-t">
            <img
              src="../../assets/image/ec70d34632caaa27bfed000ca39b8599.jpg"
              alt=""
            />
          </div>
          <div class="Adwertisement-right-b">
            <img
              src="../../assets/image/f1ab4555112c48503c7fdd8712531102.jpg"
              alt=""
            />
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Main',
  components: {},
  data() {
    return {}
  },
  computed: {},
  watch: {},
  created() {
    this.getSelect()
  },
  mounted() {},
  methods: {
    getSelect() {
      this.$request.get('/wapi/zpCommon/data/position.json')
      .then(res => {
        // console.log(res.zpData);
      })
    }
  },
}
</script>
<style scoped>
.Main {
  width: 100%;
  height: 100%;
  margin-bottom: 50px;
}
.Main-wrap {
  width: 1184px;
  height: 340px;
  margin: auto;
}
.Position-select {
  width: 384px;
  height: 345px;
  float: left;
  margin-right: 10px;
  background-color: #fff;
}
.Position-select img{
  width: 384px;
  height: 113.5px;
}
.Adwertisement {
  width: 785px;
  height: 340px;
  float: left;
}
.Adwertisement-left {
  width: 520px;
  height: 340px;
  float: left;
}
.Adwertisement-left-t,
.Adwertisement-left-b {
  width: 530px;
  height: 112px;
}
.Adwertisement-left-t > img {
  display: block;
  width: 260px;
  height: 112px;
  margin-right: 5px;
  margin-bottom: 5px;
  float: left;
}
.Adwertisement-left-b > img {
  display: block;
  width: 525px;
  height: 112px;
  margin-right: 10px;
}
.Adwertisement-right {
  width: 256px;
  height: 340px;
  float: right;
}
.Adwertisement-right-t {
  width: 256px;
  height: 228px;
  margin-bottom: 5px;
}
.Adwertisement-right-t > img {
  display: block;
  width: 256px;
  height: 228px;
}
.Adwertisement-right-b {
  width: 256px;
  height: 112px;
}
.Adwertisement-right-b > img {
  display: block;
  width: 256px;
  height: 112px;
}
</style>